<template>
  <div v-loading="loading" class="general-view mb15">
    <div class="list-table linear">
      <div class="investMain">
        <span class="logo">
          <img v-if="companyData.logoInfo" :src="companyData.logoInfo">
          <div v-else class="lazyImg">{{ companyData.companyName }}</div>
        </span>
        <div class="mes">
          <h3 class="m0">{{ companyData.companyName }}<el-link type="primary" style="color: rgba(0, 18, 181, 1);margin-left: 10px;font-size: 15px !important;" :underline="false" @click="updateCompanyData">{{ $t('更新数据') }}</el-link></h3>
          <div class="bottom mt10">
            <span class="tags m0">
              <el-tag v-for="(tag, index) in companyData.companyTagList" :key="index" style="cursor: pointer" size="small" effect="plain" :style="index === 0 ? 'color: rgba(20, 200, 199, 1)!important;background: rgba(20, 200, 199, 0.1);' : ''">{{ tag }}</el-tag>
            </span>
          </div>
        </div>
      </div>
      <div class="investDetail">
        <el-row class="detail" :gutter="20">
          <el-col :span="8">
            <span class="label">{{ $t('法人代表') }}：</span>
            <span class="link-hover-click" :title="companyData.legalPerson">{{ companyData.legalPerson == undefined ? '' : companyData.legalPerson }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('成立时间') }}：</span>
            <span class="link-hover-click">{{ companyData.setDate == undefined ? '' : renderTime(companyData.setDate) }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('企业统一社会信用代码') }}：</span>
            <span class="link-hover-click" :title="companyData.creditCode">{{ companyData.creditCode == undefined ? '' : companyData.creditCode }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('注册资本') }}{{ $t('金额单位') }}：</span>
            <span class="link-hover-click" :title="companyData.capitalRegistered">{{ companyData.capitalRegistered == undefined ? '' : moneyFormat(companyData.capitalRegistered, 'w') }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('实缴资本') }}{{ $t('金额单位') }}：</span>
            <span class="link-hover-click" :title="companyData.actualCapital">{{ companyData.actualCapital == undefined ? '' : moneyFormat(companyData.actualCapital, 'w') }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('币种') }}：</span>
            <span class="link-hover-click" :title="companyData.currency">{{ companyData.currency == undefined ? '' : currencyFormat(companyData.actualCurrency) }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('工商注册号') }}：</span>
            <span class="link-hover-click" :title="companyData.regNumber">{{ companyData.regNumber == undefined ? '' : companyData.regNumber }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('纳税人识别号') }}：</span>
            <span class="link-hover-click" :title="companyData.taxNumber">{{ companyData.taxNumber == undefined ? '' : companyData.taxNumber }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('组织机构代码') }}：</span>
            <span class="link-hover-click" :title="companyData.orgNumber">{{ companyData.orgNumber == undefined ? '' : companyData.orgNumber }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('营业期限') }}：</span>
            <span v-if="companyData.fromTime && companyData.toTime" class="link-hover-click">{{ renderTime(companyData.fromTime) }}{{ $t(' 至 ') }}{{ renderTime(companyData.toTime) }}</span>
            <span v-else-if="companyData.fromTime" class="link-hover-click">{{ renderTime(companyData.fromTime) }}{{ $t(' 至 ') }}{{ $t('无固定期限') }}</span>
            <span v-else class="link-hover-click">-</span>
          </el-col>
          <!--          <el-col :span="8">-->
          <!--            <span class="label">{{ $t('纳税人资质') }}：</span>-->
          <!--            <span class="link-hover-click">-</span>-->
          <!--          </el-col>-->
          <el-col :span="8">
            <span class="label">{{ $t('核准日期') }}：</span>
            <span class="link-hover-click" :title="companyData.approvedTime">{{ companyData.approvedTime == undefined ? '' : renderTime(companyData.approvedTime) }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('企业类型') }}：</span>
            <span class="link-hover-click" :title="companyData.companyOrgType">{{ companyData.companyOrgType == undefined ? '' : companyData.companyOrgType }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('一级行业') }}：</span>
            <span class="link-hover-click" :title="companyData.industryFirstLabel">{{ companyData.industryFirstLabel == undefined ? '' : $t(companyData.industryFirstLabel) }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('二级行业') }}：</span>
            <span class="link-hover-click" :title="companyData.industrySecondLabel">{{ companyData.industrySecondLabel == undefined ? '' : $t(companyData.industrySecondLabel) }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('人员规模') }}：</span>
            <span class="link-hover-click" :title="companyData.staffNumRange">{{ companyData.staffNumRange == undefined ? '' : companyData.staffNumRange }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('参保人数') }}：</span>
            <span class="link-hover-click" :title="companyData.socialStaffNum">{{ companyData.socialStaffNum == undefined ? '' : companyData.socialStaffNum }}</span>
          </el-col>
          <el-col :span="8">
            <span class="label">{{ $t('注册省市') }}：</span>
            <span v-if="companyData.provinceRegisteredLabel && companyData.cityRegisteredLabel" class="link-hover-click">{{ companyData.provinceRegisteredLabel == undefined ? '' : $t(companyData.provinceRegisteredLabel) }}-{{ companyData.cityRegisteredLabel == undefined ? '' : $t(companyData.cityRegisteredLabel) }}</span>
            <span v-else-if="companyData.provinceRegisteredLabel" class="link-hover-click">{{ companyData.provinceRegisteredLabel == undefined ? '' : $t(companyData.provinceRegisteredLabel) }}</span>
            <span v-else class="link-hover-click">-</span>
          </el-col>
          <el-col :span="24">
            <span class="label">{{ $t('注册地址') }}：</span>
            <span class="link-hover-click" :title="companyData.detailsRegistered">{{ companyData.detailsRegistered == undefined ? '' : $t(companyData.detailsRegistered) }}</span>
          </el-col>
          <el-col :span="24" class="">
            <span class="label">{{ $t('企业简介') }}：</span>
            <span class="link-hover-click" :title="companyData.remark">{{ companyData.remark == undefined ? '' : companyData.remark }}</span>
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- 添加或修改公司基本信息对话框 -->
    <el-dialog :title="$t('公司基本信息')" :visible.sync="formOpen" :close-on-click-modal="false" :lock-scroll="false" custom-class="dialogForm" append-to-body>
      <companyBaseForm ref="companyBaseForm" />
    </el-dialog>
  </div>
</template>
<script>

import { getCompanyBaseByDealId, updateBusinessInfoByCompanyId } from '@/api/company/base/companyBase'
import { getByIdFindPostInvestmentInformation } from '@/api/deal/investment/dealInvestment'
import companyBaseForm from '@/views/company/base/companyBaseForm.vue'
export default {
  components: {
    companyBaseForm
  },
  props: {
    type: {
      type: String,
      default: undefined
    }
  },
  // filters: {
  //   filterText: function(value) {
  //       var patrn = /[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/gi
  //       if (!patrn.exec(value) && value && value.length > 0) {
  //         value = value.substring(0, 1)
  //       } else if (value && value.length < 2 && value.length > 0) {
  //         value = value.substring(0, 1)
  //       } else if (value && value.length <= 4 && value.length >= 2) {
  //         value = value.substring(0, 2)
  //       } else if (value && value.length > 4) {
  //         value = value.substring(0, 4)
  //       }
  //       return value
  //   }
  // },
  data() {
    return {
      companyData: {},
      currencyOptions: undefined,
      loading: false,
      formOpen: false,
      investInfoData: {},
      investList: [],
      companyTagList: []
    }
  },
  created() {
    this.getDicts('currency').then(response => {
      this.currencyOptions = response.data
    })
  },
  mounted() {
    this.init()
  },
  methods: {
    // 初始化数据
    init() {
      this.loading = true
      this.investList = []
      this.companyData = this.investInfoData = {}
      getCompanyBaseByDealId(this.$route.query.id, this.$route.query.companyId).then(response => {
        this.companyData = response.data
        getByIdFindPostInvestmentInformation(this.$route.query.id, 'undefined').then(response => {
          this.investInfoData = response.data[0]
          if (this.investInfoData?.name !== undefined && this.investInfoData.name !== '') {
            this.investList = this.investInfoData.name.split(',')
          }
        })
        this.loading = false
      })
    },
    renderTime(date) {
      var dateTemp = new Date(date).toJSON()
      return new Date(+new Date(dateTemp) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '').substr(0, 10)
    },
    // 币种字典翻译
    currencyFormat(value) {
      if (value) {
        return this.selectDictLabel(this.currencyOptions, value)
      }
    },
    editForm() {
      this.formOpen = true
      this.$nextTick(() => {
        this.$refs.companyBaseForm.init(this.$route.query)
        this.$refs.companyBaseForm.openLocation = 'Home'
      })
    },
    updateCompanyData() {
      updateBusinessInfoByCompanyId(this.$route.query.companyId).then(response => {
        if (response.code === 200) {
          this.msgSuccess(this.$t('正在更新数据，请等待约三分钟后刷新查看'))
        } else {
          this.msgError(response.msg)
        }
      })
    }

  }
}
</script>
<style lang="scss" scoped>
.tag-container {
  display: flex;
  gap: 5px; /* 使用gap属性来设置标签之间的间距，注意这个属性在一些旧版浏览器中可能不被支持 */
  align-items: center; /* 控制标签在垂直方向上的对齐 */
  justify-content: flex-start; /* 控制标签在水平方向上的对齐 */
  margin-top: 5px;
}

.custom {
  background-color: #f6f7fb !important;
}

.pre {
  white-space: pre-wrap !important;
  word-break: break-all;
  word-wrap: break-word;
}
.m0{
  margin: unset !important;
}
.investDetail{
  padding: 0 13px;
  position: relative;
  font-size: 14px;
  margin: 0 !important;
  border-radius: 5px;
  .el-col {
    margin-bottom: 8px;
    line-height: 24px;
    display: flex;
    .label {
      color: #8a8a8a;
    }
    .link-hover-click {
      color: #333;
      font-weight: bold;
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}
</style>
